<template>
	<page-loading :show="dataList.length > 0">
		<view class="baclorf6">
			<view class="search-bar"><u-search :show-action="false" placeholder="搜索品牌/车型/配置等" bg-color="#fff" v-model="searchVal" @search="search"></u-search></view>

			<view class="top-bar">
				<view class="li" v-for="(it, index) in navlist" :key="index" @click="fabuxcclick(index)">
					<view class="icon"><i-icon :icon="it.icon" type="multiple" size="80rpx"></i-icon></view>
					<view class="name">{{ it.name }}</view>
				</view>
			</view>

			<u-sticky offset-top="92" class="sticky" :class="fixed ? 'stickyActive' : ''" @fixed="fixed = true" @unfixed="fixed = false">
				<view :class="['sticky', fixed ? 'width375' : '']">
					<view class="border-bottom-1 stickytitle" :class="fixed ? 'pad-l-20' : ''">寻车列表({{ totalpage }})</view>
					<findCar :type="1" @change="filterFindCarListChange" @close="close" @open="open"></findCar>
				</view>
			</u-sticky>
			<!-- 默认图片 -->

			<view class="looking-car">
				<view class="default" v-if="dataList.length > 0">
					<!-- <scroll-view scroll-y="true" style="height: 100%;width: 100%;" lower-threshold='100' @scrolltolower="$u.throttle(reachBottom, 500)"> -->
					<view class="li" v-for="(it, index) in dataList" :key="index" @click="Findcardetails(it, '1')">
						<view class="main">
							<view class="good-img"><image :src="it.goodimg" mode="aspectFill"></image></view>
							<view class="info">
								<view class="title">
									<view class="icon">寻</view>
									<view class="icon-main">{{ it.car_Type_Name }}{{ it.car_name }}</view>
								</view>
								<view class="line">
									<text class="name">类型：</text>
									<text class="con">{{ it.specification }}</text>
								</view>
								<view class="line flex">
									<text class="name">外观/内饰：</text>
									<view class="con width-70">
										<view class="" v-for="(color, ind) in it.facade_Picture" :key="ind">
											<view class="flex-jc-sb width-100 color-333" v-if="color.outerColour && color.inColour">
												<view :style="{ background: color.outerColour.colorCoding }" class="iconcolor"></view>
												{{ color.outerColour.color }} /{{ color.inColour.color }}
												<view v-if="color.inColour.neiColor.length == 1" :style="{ background: color.inColour.colorCoding }" class="iconcolor"></view>
												<view v-else class="iconcolor"><view class="iconcolor2" v-for="(it, i) in color.inColour.neiColor" :key="i" :style="{ background: it }"></view></view>
											</view>
										</view>
									</view>
								</view>
								<view class="line">
									<text class="name">上牌地：</text>
									<text class="con">{{ it.goods_Region_Name }}</text>
								</view>
								<view class="line">
									<text class="name">发布日期：</text>
									<text class="con">{{ it.addTime.split('T')[0] }} {{ it.addTime.split('T')[1] }}</text>
								</view>
								<view class="line">
									<text class="name">有效期至：</text>
									<text class="con">{{ it.deadline.split('T')[0] }}</text>
								</view>
								<view class="line">
									<text class="orange import">{{ it.remark }}</text>
								</view>
							</view>
						</view>
						<view class="bar">
							<view class="left">
								<view class="store-name">
									<text class="orange">{{ it.views }}</text>
									次浏览/已有
									<text class="orange">{{ it.offerAmount }}</text>
									家车商报价
								</view>
								<view class="bar-bottom flex">
									<text class="name">剩余报价时间：</text>
									<view class="con"><u-count-down separator-size="26" font-size="26" :timestamp="it.countdown" separator="zh"></u-count-down></view>
								</view>
							</view>

							<view class="right">
								<view class="btn" @click.stop="Findcardetails(it, '2')">我要报价</view>
								<view class="tips">报价后可联系买方</view>
							</view>
						</view>
					</view>
					<!-- </scroll-view> -->
					<u-loadmore :status="loadmoreArr[loadmore]" />
				</view>
				<view class="default" v-else><defaultImg></defaultImg></view>
			</view>
		</view>
	</page-loading>
</template>
<script src="./findtheCar.js"></script>
<style lang="scss" scoped>
@import './findtheCar.scss';
</style>
